import React from 'react'
import { useNavigate ,useLocation,useParams} from 'react-router-dom';
import { useDispatch ,useSelector } from 'react-redux';
import { Toast, NavBar,Button,Cell, Image } from 'react-vant';
import {STROETYPE,PROPSTYPE } from '../Type/Store.d';
import ChildrenItem from '../Com/ChildrenItem';

function Detail() {
    const Dispatch = useDispatch();
    const Navigate = useNavigate();
    const Location = useLocation();
    const Params = useParams();

    return (
        <div className='Detail'>
            <NavBar
                title={(Location.state as PROPSTYPE).txt}
                onClickLeft={() => Navigate('/')}
            />
            <ChildrenItem obj={(Location.state as PROPSTYPE)}></ChildrenItem>
            <Button type="info" block round>开始游戏</Button>
            <h3>详情:</h3>
            <Image width='100%' height={200} src={(Location.state as PROPSTYPE).src}/>
            <p>游戏简介:<br/>{(Location.state as PROPSTYPE).con}</p>
        </div>
    )
}

export default Detail